<template>
  <el-dialog
    :title="title"
    center
    :visible.sync="openState"
    :close-on-click-modal="false"
    width="1024px"
    append-to-body
    v-if = "openState"
  >
    <div class="discountReceipt-pick-operate-box">
      <div class="operate-box-top">
        <Ht-search-form
          :defaultEventKey="pageEvenKey"
          :dictMap="dictMap"
          :queryParams="queryParams"
          :outputQueryParams="queryParams"
          :formOptions="formOptions"
          :advOptions="[]"
          :labelWidth="90"
        ></Ht-search-form>
      </div>
      <div class="operate-box-bottom">
        <div class="bottom-content">
          <ht-table
          :defaultEventKey="pageEvenKey"
            ref="dataTable"
            rowKey="keyword,drct"
            :showSerialNumber="false"
            :multi-select="false"
            :dictMap="dictMap"
            :reqConfig="reqConfig"
            :queryParams="queryParams"
            :tableBindColumns="tableBindColumns"
            :showRightToolbar="false"
            :opButtonList="opButtonList"
          >
            <template v-slot:operate>
              <el-table-column
                label="操作"
                align="center"
                fixed="right"
                width="160"
                class-name="small-padding fixed-width"
              >
                <template slot-scope="scope">
                  <ht-button-group
                    :buttonList="[
                      {
                        label: '修改',
                        doFunc: () => {
                          update(scope.row);
                        },
                      },
                      {
                        label: '删除',
                        doFunc: () => {
                          del(scope.row);
                        },
                      },
                    ]"
                  />
                </template>
              </el-table-column>
            </template>
          </ht-table>
        </div>
      </div>
    </div>
    <keyword-add-dialog
      ref="keywordAddDialog"
      @editComplete="keywordEditComplete"
    ></keyword-add-dialog>

    <keyword-update-dialog
      ref="keywordUpdateDialog"
      @editComplete="keywordEditComplete"
    ></keyword-update-dialog>
  </el-dialog>
</template>

<script>
import { keywordSearchUrlConfig,keywordDelete } from "@/api/cnaps/bizMng/stpInstall.js";
import { listPageMixin } from "@/libs/listPageMixin";
import KeywordAddDialog from "./keyword-add";
import KeywordUpdateDialog from "@/views/cnaps/bizMng/stpSetManagement/stpInstall/keyword-update";

export default {
  name: 'KeywordDialog',
  mixins: [listPageMixin],
  components: {
    KeywordUpdateDialog,
    KeywordAddDialog
  },
  props: {},
  data() {
    return {
      pageEvenKey: 'KeywordDialog',
      title: '',
      incomingShow: false,
      outgoingShow: false,
      openState: false,
      // 来源标识 为了服用区分是哪个选项触发的
      fromFlag: '',
      dictMap: {},
      //数据字典
      searchFormDictList: [
        "DRCTCODE","KEYSTYLE","STP_FIELD","STP_PKGNO"
      ],
      tableLoadingState: false,
      formOptions: [],
      opButtonList: () => {
        return [
        {
            label: "新增往账关键字",
            type: "primary",
            icon: "el-icon-plus",
            visible: this.outgoingShow,
            actionType: 'add',
            clickFun: () => {
              this.addOutgoing();
            }
          },
          {
            label: "新增来账关键字",
            type: "primary",
            icon: "el-icon-plus",
            visible: this.incomingShow,
            actionType: 'add',
            clickFun: () => {
              this.addIncoming();
            }
          },
        ];
      },
      queryParams: {
        pkgno:'',
        keyword:'',
        field:'',

      },
      reqConfig: keywordSearchUrlConfig,
      tableBindColumns: [
        { label: `报文类型`, prop: "pkgno", align: "center",dictCode: "STP_PKGNO"},
        { label: `校验字段`, prop: "field", align: "center",dictCode: "STP_FIELD"},
        { label: `来账方向`, prop: "drct",  align: "center", dictCode: "DRCTCODE"},
        { label: `校验方式`, prop: "keystyle",  align: "center",dictCode: "KEYSTYLE"},
        { label: `关键字`, prop: "keyword",  align: "center"},
        { label: `备注`, prop: "remark",  align: "center"},

      ],
    };
  },
  mounted() {
    this.formOptions = [
      {
        type: "input",
        prop: "keyword",
        defaultAttr: {
          label: "关键字",
          placeholder: "请选择关键字",
        },
      },
      {
        type: "dict",
        dict: "STP_PKGNO",
        prop: "pkgno",
        defaultAttr: {
          label: "报文类型",
          placeholder: "请选择报文类型",
        },
      },

      {
        type: "dict",
        dict: "STP_FIELD",
        prop: "field",
        defaultAttr: {
          label: "校验字段",
          placeholder: "请选择校验字段",
        },
      },

      {
        type: "dict",
        dict: "DRCTCODE",
        prop: "drct",
        defaultAttr: {
          disabled: true,
          label: "来往账标志",
          placeholder: "请选择来往账标志",
        },
      },
    ];
  },
  methods: {
    //列表查询
    getList() {
      this.doQuery();
    },
   /** 搜索按钮操作 */
   handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
    },
    show(row) {
      this.queryParams.drct = row.drct;
      this.queryParams.nstpType = row.nstpType;
      this.openState = true;
      if(row.drct =='1'){
        this.outgoingShow = true;
        this.incomingShow = false;
      }else if(row.drct == '2'){
        this.outgoingShow = false;
        this.incomingShow = true;
      }

      if(this.$refs.dataTable) {
        this.$refs.dataTable.doQuery();
        this.$refs.dataTable.genQuickButtonList(this.opButtonList());
      }
    },
    close() {
      this.openState = false;
    },
    loadData() {},

    /** 删除关键字 */
    del(row) {
      row.nstpType = this.queryParams.nstpType;
      this.$confirm("确认删除该条关键字信息?", "警告", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(function() {
          return keywordDelete(row);
        })
        .then(() => {
          this.handleQuery();
          this.msgSuccess("删除提交成功");
          this.$emit("editComplete", true);
          this.close();
        })
        .catch(action => {});
    },

    update(row){
      console.log(row.field)
      row.nstpType = this.queryParams.nstpType;
      this.$refs.keywordUpdateDialog.show(row)
    },

     /** 新增往账关键字 */
     addOutgoing() {
      console.log("this.$refs.keywordAddDialog", this.$refs.keywordAddDialog);
      // this.close();
      this.$refs.keywordAddDialog.show(this.queryParams.drct,this.queryParams.nstpType);
    },

    /** 新增来账关键字 */
    addIncoming() {
      console.log("this.$refs.keywordAddDialog", this.$refs.keywordAddDialog);
      // this.close();
      this.$refs.keywordAddDialog.show(this.queryParams.drct,this.queryParams.nstpType);
    },

    keywordEditComplete(state) {
      if (state == true) {
        this.getList();
        this.$emit("editComplete", true);
        this.close();
      }
    },
  },
};
</script>

<style scoped></style>
